<template>
	<div class="teachVideo">
		<div class="teach_h clear">
			<span>我的视频</span>
			<div class="teach_lk fr">
				<router-link to="/teach/video/add">上传视频</router-link>
			</div>
		</div>
		<!--  -->
		<ul v-loading="loading">
			<li class="teachVideo_ls clear" v-for="(item, index) in videoList" :key="item.id">
				<a @click="videoView(item, item.status_m3u8 == 1 ? 1 : 0)" class="teachVideo_lsl fl box">
					<img :src="BASE_URL+item.picture" :onerror="errorImg">
				</a>

				<div class="teachVideo_lsr">
					<div class="teachVideo_lsr1 clear">
						<a @click="videoView(item,item.status_m3u8 == 1 ? 1 : 0)">{{item.video_name}}</a>
						<div class="teachVideo_lsr1_r fr">
							<router-link :to="{path: '/teach/video/detail', query:{id: item.id}}">
								提问 {{item.question_count}}
								</router-link">
								<el-popover v-if="item.status_m3u8 == 1" placement="bottom" width="" popper-class="ioperation_hover" trigger="hover">
									<ul class="r_ioperation">
										<li>
											<span @click="videoView(item , 2)">编辑</span>
										</li>
										<li>
											<a :href="download(item.id)">下载</a>
										</li>
										<li @click="removeList(item.id)">删除</li>
									</ul>
									<i slot="reference" class="el-icon-arrow-down"></i>
								</el-popover>
						</div>
					</div>
					<!--  -->
					<div class="teachVideo_lsr2">
						<template>
							<span class='video-status'>{{item.status_m3u8 == 1 ? '正常' : '转码中'}}</span>
						</template>
						<span :class="item.authority == 1 ? 'Tstate_y' : 'Tstate_n' " >{{item.authority == 1 ? '公开' : '不公开'}}</span>
						<template v-if='!$store.state.isSchool'>
							<span>类型：{{item.type_name}}</span>
							<span>学分 : {{item.study_score}}</span>
						</template>
						<i v-if="item.remained_days" class="displayTime">剩余时间: {{item.remained_days}}</i>
					</div>
					<!-- 3 -->
					<div class="teachVideo_lsr2" v-if="item.profile != ''">
						<el-tooltip class="item" effect="dark" :content="item.profile" :disabled="item.profile.length < 30 ? true : false" placement="top-start">
							<p>简介：{{item.profile}}</p>
						</el-tooltip>
					</div>
				</div>
			</li>
		</ul>
		<!--  -->
		<div class="pageBox" v-if="total_number > page_size">
			<el-pagination @current-change="change_page" :current-page="page_index" :page-size="page_size" layout="prev, pager, next" :total="total_number">
			</el-pagination>
		</div>
		<div class="dependent" v-if="placeholder">
			<i class="ipm image_nofound"></i>
			<p>
				还没发现任何相关的内容哦~
			</p>
		</div>
	</div>
</template>
<script>
export default {
	name: '',
	data() {
		return {
			videoList: [],
			page_index: 1, //分页
			page_size: this.$g.page_size, //分页--当前页
			total_number: 0, //分页总数
			placeholder: false,
			errorImg: 'this.src="' + require('../../../public/images/image20.png') + '"',
			loading: true,
			timer: null,
		}
	},
	created() {
		this.get_videoList()
	},
	mounted() {
		this.timer = setInterval(() => {
			this.get_videoList()
		}, 180000);

	},
	destroyed() {
		clearInterval(this.timer)
	},
	methods: {
		download(res_id) {
			return this.BASE_URL + "/index/openclass/videodownload?id=" + res_id + "&type=0&userid=" + this.$g.user_id;
		},
		//是否转码完成, jump_type:1.跳转视频详情页，2.跳转视频编辑页
		videoView(obj, jump_type = 1) {
			this.loading = true;
			let success = (data => {
				this.loading = false;
				if (jump_type === 1) {

					let host = sessionStorage.getItem('host')
					let redirectParams = sessionStorage.getItem('redirect_params')
					let link = `${this.BASE_URL}${redirectParams}&host=${host}&routerUrl=home/openclassDetail&id=${obj.id}`
					window.open(link)

				} else if (jump_type === 2) {
					this.$router.push('/teach/video/edit?id=' + obj.id);
				} else if (jump_type === 0) {
					this.$message.warning('视频正在合成中，在合成期间视频将不能播放以及无法编辑')
				}
			})
			let fail = (data => {
				this.loading = false;
				this.$message.warning(data.msg)
			})
			//执行请求，并将回调方法变成config成员以便鉴权过期可以执行
			this.$ajax.get('api/video/check_view', { params: { id: obj.id }, func: { success: success, fail: fail } })
		},

		get_videoList() {
			let success = (res => {
				
				let data = res.data;
				this.videoList = data.data;
				this.total_number = data.data_sum;
				this.page_index = parseInt(data.page_index);

				this.loading = false
				this.videoList.length === 0 ?
					this.placeholder = true :
					this.placeholder = false
			})
			this.$ajax({
				url: 'api/video/video_list',
				method: 'get',
				params: {
					create_id: this.$g.user_id,
					page_index: this.page_index,
					page_size: this.page_size,
					data_type: 2
				},
				func: {
					success: success
				}
			})
		},

		change_page(val) {
			this.page_index = val;
			this.get_videoList()
		},
		//删除
		removeList(res_id) {
			this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning',
				customClass: 'confirm-them',
			}).then((res) => {
				let success = (res => {
					this.$message.success(res.msg);
					this.page_index = 1;
					this.get_videoList()
				});
				this.$ajax({
					url: 'api/video/video',
					method: 'delete',
					params: {
						videoid: res_id,
						type: 2
					},
					func: {
						success: success
					}
				})

			}).catch(() => {});
		}
	}
}
</script>